<template>
  <lay-container fluid="true" style="padding: 10px">
    <lay-row :space="10">
      <lay-col :md="24">
        <lay-card>
          <lay-table :page="page" :columns="columns" :dataSource="dataSource" :default-toolbar="defaultToolbar"
            v-model:selectedKeys="selectedKeys" @change="change" :size="tablesize">
            <template v-slot:operator="{ data }">
              <lay-button type="danger" @click="deleteColumn(data.id)" v-permission="PerKey.Attment_Delete">删除</lay-button>
            </template>
          </lay-table>
        </lay-card>
      </lay-col>
    </lay-row>
  </lay-container>
</template>

<script lang="ts" setup>
import { ref, watch } from "vue";
import { layer } from "@layui/layer-vue";
import { getList, delOne } from "../../api/module/attment";
import {PerKey} from "../../library/permissionConst"

const selectedKeys = ref(["1"]);
const checkbox = ref(true);
const defaultToolbar = ref(true);
const page = ref({ total: 0, limit: 10, current: 1, showRefresh: true, });
const tablesize = ref('md');
const columns = [
  {
    title: "Id",
    width: "50px",
    key: "id"
  }, {
    title: "文件名",
    width: "180px",
    key: "filename"
  }, {
    title: "URL",
    width: "280px",
    key: "url"
  }, {
    title: "所在部门",
    width: "80px",
    key: "deptName"
  }, {
    title: "上传人",
    width: "80px",
    key: "nickname"
  }, {
    title: "大小kb",
    width: "40px",
    key: "size"
  }, {
    title: "上传位置",
    width: "180px",
    key: "source"
  },
  {
    title: "上传时间",
    width: "120px",
    key: "time"
  },
  {
    title: "操作",
    width: "100px",
    customSlot: "operator",
    key: "operator",
    align: "center",
  }
]
const dataSource = ref([])

const GetList = function (current = page.value.current, limit = page.value.limit) {
  getList(current, limit).then((res) => {
    if (res.status == 1) {
      dataSource.value = res.data
      page.value.total = res.count
    }
  })
}

const change = function ({ current, limit }: any) {
  GetList(current, limit);
};
const deleteColumn = function (id: number) {
  layer.confirm("确认删除ID: " + id + " 的附件", {
    title: "警告", move: "true", shade: "false", shadeClose: "true",
    btn: [{
      text: '确认', callback: (layerId: number) => {
        delOne(id).then((res) => {
          if (res.status == 1) {           
            layer.msg(res.msg, { time: 1000, icon: 1 },()=>{
               GetList()
            });
          } else {
            layer.msg(res.msg, { time: 1000, icon: 2 });
          }
          layer.close(layerId);
        })
      }
    }, {
      text: '取消', callback: function (layerId: number) {
        layer.close(layerId);
      }
    }]
  })
}



GetList()


</script>
